@extends('layouts.admin')
@section('pageTitle', '新建投放')
@section('style')
    <style>

        /*meiyun*/
        .mgud{
            margin: 20px auto;
        }
        .mgb10{
            margin-bottom: 10px;
        }
        .mgr30{
            margin-right: 30px;
        }
        .main-panel{
            overflow: auto;
        }

        .card form [class*="col-"]:first-child {
            padding: 0 6px;
        }

        .card form [class*="col-"]:last-child {
            padding: 0 6px;
        }

        .template-active-img img {
            width: 100%;
            height: auto;
            overflow: hidden;
        }
        .template-active-img .user-template-btn {
            position: absolute;
            bottom: 20px;
            left: 50%;
            margin-left: -22px;
        }
        .template-active-img .template-qrcode {
            width: 100%;
            height: 100%;
            position: absolute;
            left: 0;
            top: 0;
            background: rgba(0,0,0,.5);
            display: none;
        }
        .template-active-img:hover .template-qrcode{
            display:block
        }
    </style>
@endsection
@section('content')
    <div class="main-panel">
        <div class="content">
            <div class="container-fluid">

                <div class="row">
                    <div class="col-md-12">
                       <div class="card">
                            <div class="content content-full-width">

                                <form id="wizardForm" class="form-horizontal" method="" action="" >

                                    <div class="row">
                                        <div class="col-xs-4 app">
                                            <div class="phone-view">
                                                <div class="app-view">
                                                    <div class="point-app-mainC">
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-xs-8">
                                            <div class="row">
                                                <div class="col-sm-12">
                                                    <div class="form-group">
                                                        <label class="col-sm-2 control-label">规则名称</label>
                                                        <div class="col-sm-7">
                                                            <input class="form-control point-rule-name" type="text"
                                                                   placeholder="请输入规则名称，最多支持20个字符"
                                                                   maxlength=20
                                                                   name="prizename"
                                                                   required="required"
                                                            />
                                                        </div>
                                                    </div>
                                                    <div class="form-group">
                                                        <label class="col-sm-2 control-label">活动位置</label>
                                                        <div class="col-sm-7">
                                                            <a href="/web/activityPoint/list" target="_blank">请先完成位置埋点</a>
                                                        </div>
                                                    </div>
                                                    <div class="form-group">
                                                        <label class="col-sm-2 control-label">活动位置</label>
                                                        <div class="col-sm-7">
                                                            <label class="radio-inline">
                                                                <input type="radio" name="pointPosition" class="" value="" checked> 同步用户建立的位置埋点
                                                            </label>
                                                            <label class="radio-inline">
                                                                <input type="radio" name="pointPosition" class="" value=""> 同步用户建立的位置埋点
                                                            </label>
                                                            <label class="radio-inline">
                                                                <input type="radio" name="pointPosition" class="" value=""> 同步用户建立的位置埋点
                                                            </label>
                                                        </div>
                                                    </div>
                                                    <div class="form-group">
                                                        <label class="col-sm-2 control-label">选择平台</label>
                                                        <div class="col-sm-7">
                                                            <label class="checkbox-inline">
                                                                <input type="checkbox" name="pointLevelJs" class="" value="pointLevelJs"> Js
                                                            </label>
                                                            <label class="checkbox-inline">
                                                                <input type="checkbox" name="pointLeveliOS" class="" value="pointLeveliOS"> iOS
                                                            </label>
                                                            <label class="checkbox-inline">
                                                                <input type="checkbox" name="pointLevelAndroid" class="" value="pointLevelAndroid"> Android
                                                            </label>
                                                        </div>
                                                    </div>
                                                    <div class="form-group">
                                                        <label class="col-sm-2 control-label">投放类型</label>
                                                        <div class="col-sm-7">
                                                            <label class="radio-inline">
                                                                <input type="radio" name="pointPutCategory" class="point-put-category-banner" value="putBanner" checked> Banner
                                                            </label>
                                                            <label class="radio-inline">
                                                                <input type="radio" name="pointPutCategory" class="point-put-category-home" value="putHomePage"> 启动页
                                                            </label>
                                                            <label class="radio-inline">
                                                                <input type="radio" name="pointPutCategory" class="point-put-category-flow" value="putInfFlow"> 信息流
                                                            </label>
                                                        </div>
                                                    </div>
                                                    <!--有效时间-->
                                                    <div class="form-group">
                                                        <label class="col-sm-2 control-label">有效时间</label>
                                                        <div class="col-sm-7">
                                                            <div class="row service-charges">

                                                                <div class="col-sm-5 service-charges-name service-charges-name-0" style="padding-left: 15px;">
                                                                    <input type="text" placeholder="开始时间"  required="" name="startTime" data-msg="请输入开始时间" class="form-control datetimepicker">
                                                                </div>
                                                                <div class="col-sm-5 service-charges-remark service-charges-remark-0">
                                                                    <input type="text" placeholder="结束时间"  required="" data-msg="请输入结束时间" name="endTime" class="form-control datetimepicker">
                                                                </div>

                                                            </div>
                                                        </div>
                                                    </div>
                                                    <!--更换背景-->
                                                    <div class="form-group backgroundImg-container" >
                                                        <label class="col-sm-2 control-label">更换背景</label>
                                                        <div class="col-sm-7">
                                                            <input type="file" name="upfile" accept="image/gif,image/jpeg,image/png" data-target="uploadImageFile" data-for="backgroundImg" data-preview-file-type="text" class="form-control" value="" title="">
                                                            <input type="hidden" name="backgroundImg">
                                                            <span class="help-block">支持PNG、JPG格式，小于50KB</span>
                                                        </div>
                                                    </div>

                                                    <div class="row">
                                                        <div class="col-sm-9 col-sm-offset-2">
                                                            <ul class="nav nav-tabs" role="tablist">
                                                                <li style="float: left" class="add-pointput-inf"><i class="fa fa-plus"></i></li>

                                                                <!--<li class="active">
                                                                    <a href="#tab_container_1" role="tab" id="tab_seed_1" data-toggle="tab" aria-expanded="true">
                                                                        ID1
                                                                    </a>
                                                                </li>-->
                                                            </ul>
                                                            <div class="tab-content">
                                                                <!--<div class="tab-pane active" id="tab_container_1">
                                                                    <div class="card">
                                                                      <div class="content content-full-width">
                                                                          有效时间
                                                                           <div class="form-group">
                                                                              <label class="col-sm-2 control-label">有效时间</label>
                                                                              <div class="col-sm-7">
                                                                                  <div class="row service-charges">

                                                                                      <div class="col-sm-5 service-charges-name service-charges-name-0" style="padding-left: 15px;">
                                                                                          <input type="text" placeholder="开始时间"  required="" name="startTime" data-msg="请输入开始时间" class="form-control datetimepicker">
                                                                                      </div>
                                                                                      <div class="col-sm-5 service-charges-remark service-charges-remark-0">
                                                                                           <input type="text" placeholder="结束时间"  required="" data-msg="请输入结束时间" name="endTime" class="form-control datetimepicker">
                                                                                      </div>

                                                                                  </div>
                                                                              </div>
                                                                           </div>
                                                                           投放活动
                                                                           <div class="form-group">
                                                                                <label class="col-sm-2 control-label">投放活动</label>
                                                                            <div class="col-sm-7">
                                                                        <div class="input-group">
                                                                            <input type="text" class="form-control" placeholder="+添加活动" aria-label="添加活动">
                                                                            <div class="input-group-btn">
                                                                                <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">列表活动 <span class="caret"></span></button>
                                                                                <ul class="dropdown-menu dropdown-menu-right">
                                                                                    <li><a href="#">列表活动</a></li>
                                                                                    <li><a href="#">自由活动</a></li>
                                                                                </ul>
                                                                            </div>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                                更换背景
                                                                <div class="form-group backgroundImg-container" >
                                                                    <label class="col-sm-2 control-label">更换背景</label>
                                                                    <div class="col-sm-7">
                                                                        <input type="file" name="upfile" accept="image/*" data-target="uploadImageFile" data-for="backgroundImg" data-preview-file-type="text" class="form-control" value="" title="">
                                                                        <input type="hidden" name="backgroundImg">
                                                                        <span class="help-block">支持PNG、JPG格式，小于50KB</span>
                                                                    </div>
                                                                </div>
                                                                触发用户
                                                                <div class="form-group">
                                                                    <label class="col-sm-2 control-label">触发用户</label>
                                                                    <div class="col-sm-7">
                                                                        <select class="form-control">
                                                                            <option value="point-user-all">所有用户</option>
                                                                            <option value="point-user-sex">性别</option>
                                                                            <option value="point-user-province">省份</option>
                                                                        </select>
                                                                    </div>
                                                                </div>

                                                            </div>
                                                        </div>
                                                                </div>
                                                               测试结束-->

                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>

                                        </div>
                                    </div>
                                    <div class="footer pull-center">

                                        <button type="button" class="btn btn-info btn-fill btn-wd btn-finish sponsor_sur"
                                        >完成
                                        </button>

                                        <div class="clearfix"></div>
                                    </div>

                       </form>

                     </div>
                 </div>
                    </div>
                </div>
            </div>
        </div>
    </div>


@endsection
@section('script')
    <script src="/js/admin/closable-tab-div.js"></script>
    <script>

        $(document).ready(function () {
            $('.point-put-category-banner').click(function () {
                $('.point-app-mainC').css('background-image','url(/images/admin/put_banner.png)');
            });
            $('.point-put-category-home').click(function () {
                $('.point-app-mainC').css('background-image','url(/images/admin/put_home_page.png)');
            });
            $('.point-put-category-flow').click(function () {
                $('.point-app-mainC').css('background-image','url(/images/admin/put_flow.png)');
            });
            $('.point-rule-name').blur(function () {
                if($('.point-rule-name').val()==''){
                    $('.point-rule-name').attr('placeholder','请输入规则名称，最多支持20个字符');
                }
            });
            window.pointid=1;
            var item = {'id':window.pointid,'name':'ID'+window.pointid,'closable':false};
            closableTab.addTab(item);
            <!--添加投点详情-->

            $('.add-pointput-inf').click(function () {
                window.pointid++;
                var name ='ID'+window.pointid;
                var uri ='/web/activityPoint/addPointTV';
                var closable = 1;
                var item = {'id':window.pointid,'name':name,'closable':closable==1?true:false};
                closableTab.addTab(item);

            });

        });

        <!--购买奖品表格-->

        window.operateEvents = {
            'click .operate_buyprize':function (e,value,row) {
                var utilprice=row.prize_money;
                $('.modal-count-price').empty();
                $('.modal-buy-prizenumber').val('');
                $('.modal-unit-price').empty();
                $('.modal-unit-price').html(utilprice+"元");
                $('.modal-buy-prizenumber').on('input',function () {
                    var number=$(this).val();
                    var sum=number*utilprice;
                    $('.modal-count-price').empty();
                    $('.modal-count-price').html(sum+"元");
                })
            }

        };
        function operateFormatter(value,row,index) {
            var dropdown_id = 'dropdown_'+new Date().getTime();
            var actions = [];
            actions.push( [
                '<a rel="tooltip" title="购买" class="btn btn-simple btn-warning btn-icon table-action operate_buyprize" data-toggle="modal" data-target="#buyprizeModal" href="javascript:void(0)">',
                '购买',
                '</a>'
            ].join(''));
            return actions.join('');
        }
        $('#bootstrap-table-container').on('post-body.bs.table',function () {
            $('[rel="tooltip"]').tooltip();

        });

    </script>
@endsection